/**
 * 显示工具类
 *
 * display类：
 * [block|none|inline|inline-block]
 *
 * visibility类：
 * [visible|hidden]
 *
 * opacity类：
 * opacity-[0|10|20|50|100]
 */

// display类型映射
$displays: (
  'block': block,
  'none': none,
  'inline': inline,
  'inline-block': inline-block,
);

// visibility类型映射
$visibilities: (
  'visible': visible,
  'hidden': hidden,
);

// opacity值映射
$opacities: (
  '0': 0,
  '10': 0.1,
  '20': 0.2,
  '50': 0.5,
  '100': 1,
);

// 生成display类
@each $name, $value in $displays {
  .#{$name} {
    display: $value;
  }
}

// 生成visibility类
@each $name, $value in $visibilities {
  .#{$name} {
    visibility: $value;
  }
}

// 生成opacity类
@each $name, $value in $opacities {
  .opacity-#{$name} {
    opacity: $value;
  }
}
